{extend name="common/base"/}
<!-- 主体 -->
{block name="body"}

<div class="p-3">
	<form class="layui-form gg-form-bar border-t border-x">
		<div class="layui-input-inline" style="width:300px;">
			<input type="text" name="keywords" placeholder="请输入用户昵称关键字" class="layui-input" autocomplete="off" />
		</div>
		<div class="layui-input-inline" style="width:300px;">
			<input type="text" name="order_no" placeholder="请输入订单号" class="layui-input" autocomplete="off" />
		</div>
		<button class="layui-btn layui-btn-normal" lay-submit="" lay-filter="searchform">提交搜索</button>
	</form>
	<table class="layui-hide" id="score_order" lay-filter="score_order"></table>
</div>
<script type="text/html" id="user-info">
	<div style="display: flex">
		<img src="{{d.avatar}}" style="height:60px;width: 60px;" class="image-show">
		<div class="layui-input-inline" style="text-align:left;margin-left: 10px">
			<p>会员ID：{{d.uid}}</p>
			<p style="width: 180px;text-overflow:ellipsis;overflow: hidden">昵称：{{d.nickname}}</p>
			<!--                    <p>会员等级：{{d.level_name}}</p>-->
		</div>
	</div>
</script>
<script type="text/html" id="toolbarDemo">
	<div class="layui-btn-container">
		<!--		<span class="layui-btn layui-btn-sm" lay-event="add" data-title="添加积分订单">+ 添加积分订单</span>-->
	</div>
</script>
<div class="row col-sm-12" style="display:none;" id="show_div">
	<form class="layui-form model-form" lay-filter="submitForm2" style="margin-top: 35px">
		<div class="layui-form-item">
			<div class="layui-inline">
				<label class="layui-form-label">快递公司：</label>
				<div class="layui-input-inline">
					<select id="express_id">
						<option value="">快递公司</option>
						{volist name="express" id="v"}
						<option value="{$v.id}">{$v.name}</option>
						{/volist}
					</select>
				</div>
			</div>
		</div>
		<div class="layui-form-item">
			<div class="layui-inline">
				<label class="layui-form-label">快递单号：</label>
				<div class="layui-input-inline">
					<input type="text" name="express_num" placeholder="请输入快递单号" autocomplete="off" class="layui-input">
				</div>
			</div>
		</div>
		<div class="layui-form-item" style="margin-left: 109px">
			<div class="layui-inline">
				<button class="layui-btn">提交</button>
			</div>
		</div>
	</form>
</div>
<script type="text/html" id="barDemo">
	<div class="layui-btn-group">
		{{#  if((d.order_type == 1 && d.status == 1)){ }}
		<button class="layui-btn layui-btn-xs layui-btn-xs" lay-event="fh">发货</button>
		{{#  } }}
		<a class="layui-btn layui-btn-normal layui-btn-xs" lay-event="read">详情</a>
		<a class="layui-btn layui-btn-danger layui-btn-xs" lay-event="del">删除</a></div>
</script>

{/block}
<!-- /主体 -->

<!-- 脚本 -->
{block name="script"}
<script>
	const moduleInit = ['tool'];
	function gouguInit() {
		var table = layui.table,tool = layui.tool, form = layui.form;
		layui.pageTable = table.render({
			elem: '#score_order',
			title: '积分订单列表',
			toolbar: '#toolbarDemo',
			url: '/admin/score_order/datalist',
			page: true,
			limit: 20,
			lineStyle:'height:auto',
			cellMinWidth: 180,
			cols: [
				[
					{
						field: 'id',
						title: '编号',
						align: 'center',
						width: 80
					},{
					field: 'uid',
					title: '用户信息',
					align: 'center',
					toolbar: '#user-info',
					width: 200
				},{
					field: 'order_no',
					title: '订单号',
					align: 'center',
					width: 100
				},{
					field: 'goods_name',
					title: '商品',
					align: 'center',
					width: 100
				},{
					field: 'amount',
					title: '支付积分',
					align: 'center',
					width: 100
				},{
					field: 'status',
					title: '状态',
					align: 'center',
					width: 100,
					templet: function (d) {
						var str = "";
						if (d.status == 1) {
							str = '<span style="color: #5FB878">待发货</span>';
						} else {
							str = '<span>已完成</span>';
						}
						return str;
					},
				},{
					field: 'create_time',
					title: '下单时间',
					align: 'center',
					width: 100
				},
					{
						fixed: 'right',
						field: 'right',
						title: '操作',
						toolbar: '#barDemo',
						width: 136,
						align: 'center'
					}
				]
			]
		});

		//监听表头工具栏事件
		table.on('toolbar(score_order)', function(obj){
			if (obj.event === 'add') {
				tool.side("/admin/score_order/add");
				return false;
			}
		});

		//监听表格行工具事件
		table.on('tool(score_order)', function(obj) {
			var data = obj.data;
			if (obj.event === 'read') {
				tool.side('/admin/score_order/read?id='+obj.data.id);
			}
			else if (obj.event === 'edit') {
				tool.side('/admin/score_order/edit?id='+obj.data.id);
			}
			else if (obj.event === 'fh') {
				var id = obj.data.id;
				var index = layer.open({
					type: 1,
					title: ['商品发货'],//数组第二项可以写任意css样式；如果你不想显示标题栏，你可以title: false
					area: ['500px','400px'],
					content: $('#show_div'),
					success:function(){
						form.on('submit(submitForm2)', function (data) {
							let express_id = $('#express_id').val();
							if (!express_id) {
								layer.msg('请选择快递公司');return false
							}
							let express_num = $("input[name='express_num']").val();
							if (!express_num) {
								layer.msg('请输入快递单号');return false
							}
							$.post('/admin/score_order/send', {id:id,express_id:express_id,express_num:express_num}, function(res) {
								layer.closeAll();
								if (res.code != 0) {
									layer.msg(res.msg,{icon:0,time:1500},function(){
										window.location.reload();
									});
								} else {
									layer.msg('操作成功',{icon:1,time:1500},function(){
										window.location.reload();
									});
								}
							},'json');
							return false;
						});
					}
				})
			}
			else if (obj.event === 'del') {
				layer.confirm('确定要删除该记录吗?', {
					icon: 3,
					title: '提示'
				}, function(index) {
					let callback = function (e) {
						layer.msg(e.msg);
						if (e.code == 0) {
							obj.del();
						}
					}
					tool.delete("/admin/score_order/del", { id: data.id }, callback);
					layer.close(index);
				});
			}
			return false;
		});

		//监听搜索提交
		form.on('submit(searchform)', function(data) {
			layui.pageTable.reload({
				where: {
					keywords: data.field.keywords,
					order_no: data.field.order_no,
				},
				page: {
					curr: 1
				}
			});
			return false;
		});
	}
</script>
{/block}
<!-- /脚本 -->